import {
  createStore
} from 'vuex';
import router from '@/router';
import Cookies from 'js-cookie'
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'

export default createStore({
  state: {
    locale: zhCn,
    themeColor: localStorage.getItem("theme") || '#409eff',
    sidebar: {
      opened: !!+Cookies.get('sidebarStatus'),
      withoutAnimation: false,
      hide: false
    },
    hasRoutes: false,
    editableTabsValue: '/index',
    editableTabs: [{
      title: '首页',
      name: '/index',
      icon: 'home'
    }],
    token: '',
    menuList: '',
    currentUser: '',
    avatar: "",
  },
  getters: {
    sidebar: state => state.sidebar,
    GET_TOKEN(state) {
      return state.token || sessionStorage.getItem("token")
    },
    GET_MENU_LIST(state) {
      return state.menuList || JSON.parse(sessionStorage.getItem("menuList"));
    },
    GET_CURRENT_USER(state) {
      return state.currentUser || JSON.parse(sessionStorage.getItem("currentUser"));
    }
  },
  mutations: {
    SET_AVATAR_URL(state, avatar) {
      state.avatar = avatar;
    },
    SET_EDITABLETABS(state, editableTabs) {
      state.editableTabs = editableTabs
    },
    SET_EDITABLETABSVALUE(state, editableTabsValue) {
      state.editableTabsValue = editableTabsValue
    },
    SET_LANGUAGE: (state, locale) => {
      state.locale = locale;
    },
    SET_THEME_COLOR: (state, themeColor) => {
      state.themeColor = themeColor;
    },
    TOGGLE_SIDEBAR: state => {
      if (state.sidebar.hide) {
        return false;
      }
      state.sidebar.opened = !state.sidebar.opened
      state.sidebar.withoutAnimation = false
      if (state.sidebar.opened) {
        Cookies.set('sidebarStatus', 1)
      } else {
        Cookies.set('sidebarStatus', 0)
      }
    },
    CLOSE_SIDEBAR: (state, withoutAnimation) => {
      Cookies.set('sidebarStatus', 0)
      state.sidebar.opened = false
      state.sidebar.withoutAnimation = withoutAnimation
    },
    SET_TOKEN(state, token) {
      state.token = token
      sessionStorage.setItem("token", token)
    },
    SET_MENU_LIST(state, menuList) {
      state.menuList = menuList
      sessionStorage.setItem("menuList", JSON.stringify(menuList));
    },
    SET_CURRENT_USER(state, currentUser) {
      state.currentUser = currentUser
      sessionStorage.setItem("currentUser", JSON.stringify(currentUser));
    },
    SET_ROUTES_STATE(state, hasRoutes) {
      state.hasRoutes = hasRoutes
    },
    ADD_TABS(state, tab) {
      if (state.editableTabs.findIndex(e => e.name == tab.path) == -1) {
        state.editableTabs.push({
          title: tab.name,
          name: tab.path,
          icon: tab.icon
        })
      }
      state.editableTabsValue = tab.path
    },
    ADD_TABS_INDEX(state, path) {
      state.editableTabsValue = path
    },
    RESET_TABS(state) {
      state.editableTabsValue = '/index'
      state.editableTabs = [{
        title: '首页',
        name: '/index',
        icon: 'home'
      }]
    },
    RESET_VUEX(state, data) {
      state.token = data.token
      state.menuList = data.menuList
      state.currentUser = data.currentUser
    },
    RESET_ROUTES() {
      let routers = router.getRoutes()
      routers.map(it => {
        if (!['login'].includes(it.name)) {
          router.removeRoute(it.name)
        }
      })
    }
  },
  actions: {
    toggleSideBar({
      commit
    }) {
      commit('TOGGLE_SIDEBAR')
    },
    closeSideBar({
      commit
    }, {
      withoutAnimation
    }) {
      commit('CLOSE_SIDEBAR', withoutAnimation)
    },
  },
  modules: {}
})